<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/view/common/tag.jsp" %>
<html>
<head>
    <title>聊天机器人展览用户中心</title>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="${baseurl}/lib/layui/css/layui.css">
    <link rel="stylesheet" href="${baseurl}/css/portal/global.css">
</head>
<body>
<jsp:include page="header.jsp"></jsp:include>

<div class="layui-container fly-marginTop fly-user-main">
    <ul class="layui-nav layui-nav-tree layui-inline" lay-filter="user">
        <li class="layui-nav-item layui-this">
            <a href="${baseurl}/user/personalCenter">
                <i class="layui-icon">&#xe612;</i>
                用户中心
            </a>
        </li>
        <li class="layui-nav-item">
            <a href="${baseurl}/user/leaveMessage">
                <i class="layui-icon">&#xe620;</i>
                给管理员留言
            </a>
        </li>
    </ul>

    <div class="fly-panel fly-panel-user" pad20>

        <div class="layui-tab layui-tab-brief" lay-filter="user">
            <ul class="layui-tab-title" id="LAY_mine">
                <li data-type="mine-jie" lay-id="index" class="layui-this">我的预约</li>
                <li data-type="collection" data-url="/collection/find/" lay-id="collection">我的留言</li>
            </ul>
            <div class="layui-tab-content" style="padding: 20px 0;">
                <div class="layui-tab-item layui-show">
                    <ul class="mine-view jie-row" id="appoint_info">
                    </ul>
                    <div id="LAY_page_appoint"></div>
                </div>
                <div class="layui-tab-item">
                    <ul class="mine-view jie-row" id="leave_message">

                    </ul>
                    <div id="LAY_page_leave"></div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="fly-footer">
    <p>FUN 2021 &copy; FUN.com 出品</p>
</div>

<script id="LAY_appoint_info" type="text/html">
    {{# layui.each(d, function(index, item){ }}

    <li>
        <div class="jie-title" style="font-size: 16px">{{item.exhibitionName}}</div>
        <i style="margin-left: 15px">预约时间：{{item.appointDate}}</i>
        <em>预约码:{{item.appointNo||''}}</em>
    </li>
    {{# }); }}
    {{# if(d.length === 0){ }}
    暂无展览馆
    {{# } }}
</script>

<script id="LAY_leaveMessge_info" type="text/html">
    {{# layui.each(d, function(index, item){ }}
    <li>
        <div class="jie-title" style="font-size: 16px">{{item.exhibitionName}}</div>
        <i style="margin-left: 15px">回复内容：{{item.replyContent||''}}</i>
        <em>回复人:{{item.replyUserName||''}}</em>
    </li>
    {{# }); }}
    {{# if(d.length === 0){ }}
    暂无展览馆
    {{# } }}
</script>

<script type="text/javascript" src="${baseurl}/lib/layui/layui.js"></script>
<script type="text/javascript" src="${baseurl}/lib/layui_custom/Hlayui.js"></script>

<script>
    layui.use(['layer', 'laytpl', 'form','laypage','element','layerCustom'], function () {
        var $ =layui.jquery;
        var layer = layui.layer;
        var laytpl = layui.laytpl;
        var form = layui.form;
        var layerCustom = layui.layerCustom;
        var element = layui.element;
        var laypage = layui.laypage;

        $(function () {
            initAppoint();
            initLeaveMessge();
        })
        // ()();
        function initAppoint() {
            $.get(BaseUrl+'user/center/galleryAppointList', {page: 1, limit: 10}, function (res) {
                renderAppointList(res.data);
                var total = res.count;
                pageAppointColumn(total);
            })
        }
        /*列表渲染*/
        var renderAppointList = function (data) {
            var getTpl = document.getElementById("LAY_appoint_info").innerHTML;
            laytpl(getTpl).render(data, function (html) {
                document.getElementById("appoint_info").innerHTML = html;
            });
        }
        /*分页插件渲染*/
        var pageAppointColumn = function (total) {

            laypage.render({
                elem: 'LAY_page_appoint'
                , count: total
                , jump: function (obj, first) {
                    if (!first) {
                        getAppointPage(obj.curr, obj.limit);
                    }
                }
            });
        };

        var getAppointPage = function (page, limit) {
            $.get(BaseUrl+'user/center/galleryAppointList', {page: page, limit: limit}, function (res) {
                renderList(res.data);
            })
        }
        /*=============================================*/
        // ()();
        function initLeaveMessge() {
            $.get(BaseUrl+'user/center/gallerycommentList', {page: 1, limit: 10}, function (res) {
                renderLeaveMessgeList(res.data);
                var total = res.count;
                pageLeaveMessgeColumn(total);
            })
        }
        /*列表渲染*/
        var renderLeaveMessgeList = function (data) {
            var getTpl = document.getElementById("LAY_leaveMessge_info").innerHTML;
            laytpl(getTpl).render(data, function (html) {
                document.getElementById("leave_message").innerHTML = html;
            });
        }
        /*分页插件渲染*/
        var pageLeaveMessgeColumn = function (total) {

            laypage.render({
                elem: 'LAY_page_leave'
                , count: total
                , jump: function (obj, first) {
                    if (!first) {
                        getLeaveMessgePage(obj.curr, obj.limit);
                    }
                }
            });
        };

        var getLeaveMessgePage = function (page, limit) {
            $.get(BaseUrl+'user/center/gallerycommentList', {page: page, limit: limit}, function (res) {
                renderList(res.data);
            })
        }
    })
</script>
</body>
</html>
